import { Component,useEffect,useState } from 'react'
import { View, Text,Input,Icon,Swiper,SwiperItem,Image,Button } from '@tarojs/components'
import './index.less'
import Taro from '@tarojs/taro'
import { getBlog} from '../../api/blog'
export default function Detail (props){
  const [data,setDate] = useState({})
  
  useEffect(()=>{
    var reg = /[?&]([^=&#]+)=([^&#]*)/g;
    var r = props.tid.match(reg)[0].substr(9);
    getBlog(r)
      .then(res=>{
        console.log(res.data.data[0].user_data[0].user_photo)
        setDate(res.data.data[0])
      })
  },[])

  const getDate = (date) => {
    date = new Date(date)
    return date.getFullYear()+'年'+(date.getMonth()+1)+'月'+date.getDate()+'日'
  }

  return (
    <View className='index'>
      <View className='detail'>
        <View className='title'>{data.title}</View>
        <View className='info'>
          <Image src={data.user_data?data.user_data[0].user_photo:''}></Image>
          <Text>{data.user_data?data.user_data[0].nickname:''}</Text>
          <Button>关注</Button>
        </View>
        <View className='content'>{data.content}</View>
        <View className='date'>{getDate(data.time)}</View>
      </View>
      <View className='bottom'>
        <View className='comment'>
          <Icon class="icon-small" type="search" size="18" color="black"></Icon>
          <Input placeholder="评论"></Input>
        </View>
        
      </View>
    </View>
  )
}